@charset "UTF-8";
@import "common.scss";

header{
  height: r(123);
  //padding-top: r(48);
  div{
    width: r(706);
    margin: 0 auto;
    div{
      width: r(122);
      text-align: center;
      font-family: 微软雅黑;
      font-size: px(26);
      line-height: r(51);
    }
    .back{
      float: left;
      width: r(117);
      height: r(51);
      border: 1px solid #ff9344;
      text-align: center;
      border-radius: 15px;
      a{
        color: black;
        font-family: 微软雅黑;
        font-size: px(26);
        line-height: r(51);
        font-weight: normal;
      }
    }
    .msg{
      float: right;
      width: r(62);
      height: r(43);
      img{
        width: 100%;
        height: 100%;
      }
    }
  }
}

.content{
  width: 100%;
  position: absolute;
  top: 75px;
  bottom: px(136);
  left: 0;
  right: 0;
  // 纵向滚动
  overflow-y: scroll;
  // 弹性滚动
  -webkit-overflow-scrolling: touch;
  .mineDate{
    width: r(706);
    margin: 0 auto;
    .headPic{
      float: left;
      width: r(170);
      height: r(170);
      border-radius: 50%;
      background: #ff9344;
      overflow: hidden;
      position: relative;
      img{
        position: absolute;
        right: r(-24);
        bottom: r(-50);
        width: 150%;
      }
    }
    .arrow{
      float: right;
      color: black;
      padding-top: r(60);
      a{
        color: black;
      }
      .iconfont{
        font-size: r(50);
      }
    }
    .dateRight{
        font-family: 微软雅黑;
        padding: r(33) 0 0 r(194);
        p{
          color: #9d9d9d;
          font-size: px(26);
          &:nth-of-type(2){
            padding-top: r(15);
          }
        }
        a{
          color: black;
          font-size: px(30);
        }
      }
  }
  .mineOption{
    width: r(706);
    margin: r(26) auto 0 auto;
    a{
      font-family: 微软雅黑;
      color: black;
      font-size: px(26);
    }
    .optionBox {
      width: r(193);
      height: r(149);
      background: #b2e0a0;
      float: left;
      border: 1px solid #cccccc;
      text-align: center;
      img{
        width: r(79);
        height: r(82);
        margin-bottom: r(8);
      }
    }
    .oB2{
      background: #a0dce0;
      margin: 0 r(50);
      img{
        width: r(84);
        height: r(80);
      }
    }
    .oB3{
      background: #e0b7a0;
      img{
        width: r(124);
        height: r(81);
      }
    }
  }
  .mineCh{
    width: r(706);
    margin: 0 auto;
    .title{
      margin-top: r(40);
      &:nth-of-type(5){
        margin-top: r(70);
      }
      a{
        color: black;
      }
      .titleName{
        float: left;
        height: r(46);
        div{
          width: r(97);
          display: inline-block;
          vertical-align: middle;
          img{
            width: r(57);
          }
        }
        span{
          font-family: 微软雅黑;
          font-size: px(30);
          line-height: r(46);
          vertical-align: middle;
        }
      }
      .titleMore{
        float: right;
        a{
          font-family: 微软雅黑;
          font-size: px(24);
          color: black;
          vertical-align: sub;
          span{
            padding-right: r(8);
          }
          i{
            font-size: r(26);
            color: #ff9344;
          }
        }
      }
    }
  }
  .mineBtn{
    width: r(538);
    margin: r(35) auto 0 auto;
    text-align: center;
    div{
      float: left;
      &:nth-of-type(2){
        float: right;
      }
    }
    .btn{
      width: r(147);
      height: r(75);
      line-height: r(75);
      background: #ff9344;
      font-family: 微软雅黑;
      font-size: px(24);
      border-radius: r(40);
      a{
        color: white;
        width: 100%;
        display: block;
      }
    }
  }
}